<!-- 
通用协议页面使用示例
该文件展示了如何使用 AgreementPage 组件来创建各种协议页面
-->

<template>
	<AgreementPage 
		ref="agreementPage"
		:show-title="true"
		:loading-text="'正在加载协议内容...'"
		:error-title="'内容加载失败'"
		:error-message="'网络异常，请检查网络连接后重试'"
		:theme-color="'#73F0EA'"
		@retry="handleRetry"
	/>
</template>

<script>
	import AgreementPage from '@/components/AgreementPage.vue'
	import { agreement, inviteRule } from '@/api/common.js'
	
	export default {
		components: {
			AgreementPage
		},
		
		data() {
			return {
				agreementType: '',
				params: null
			}
		},
		
		methods: {
			// 加载协议内容
			async loadAgreement(params) {
				try {
					this.$refs.agreementPage.setLoading(true);
					
					let apiCall;
					
					// 根据协议类型选择不同的API
					switch (this.agreementType) {
						case 'member':
						case 'course':
						case 'privacy':
							apiCall = agreement(params);
							break;
						case 'invite':
						case 'rules':
							apiCall = inviteRule(params);
							break;
						default:
							apiCall = agreement(params);
					}
					
					const { data: res } = await apiCall;
					
					if (res.code === 1) {
						this.$refs.agreementPage.setContent(res.data);
					} else {
						this.$refs.agreementPage.setError(res.msg || '获取协议内容失败');
					}
				} catch (error) {
					console.error('加载协议失败:', error);
					this.$refs.agreementPage.setError('网络异常，请重试');
				}
			},
			
			// 重试处理
			handleRetry() {
				if (this.params) {
					this.loadAgreement(this.params);
				}
			}
		},
		
		onLoad(params) {
			console.log('协议页面参数:', params);
			
			// 根据参数确定协议类型
			if (params.type) {
				this.agreementType = params.type;
			} else if (params.form) {
				this.agreementType = params.form;
			} else {
				this.agreementType = 'member'; // 默认类型
			}
			
			this.params = params;
			this.loadAgreement(params);
		}
	}
</script>

<!--
使用说明：

1. 会员协议页面：
   路由: /pageA/agreement/member?type=member
   或者: /pageA/agreement/member?form=member

2. 课程购买协议：
   路由: /pageA/agreement/member?type=course
   或者: /pageA/agreement/member?form=course

3. 隐私政策：
   路由: /pageA/agreement/member?type=privacy

4. 邀请规则：
   路由: /pageA/agreement/rules?type=invite
   或者: /pageA/agreement/rules

5. 其他规则：
   路由: /pageA/agreement/rules?type=rules

组件特性：
- 统一的加载状态显示
- 优雅的错误处理
- 响应式设计，适配各种屏幕
- 丰富的HTML内容样式优化
- 支持重试机制
- 可自定义主题色和文案
- 支持渐变标题区域
- 自动设置页面标题
-->